<template>
    <div>
        {{ cont }}
        {{ list }}
        {{ redone }}
        <span @click="gooclis">
            点击
        </span>
        {{ nustr }}
    </div>
</template>
<script lang="ts">
import { ref, onMounted, computed } from "vue"
export default {
    name: "HomeIndex",
    setup() {
        let cont = ref(2)
        let conts = ref(2)
        //数组，对象，字符串，数字等类型  ref 响应式       
        // 数组  number[] = [1,2]  /  Array<string> = ['1','2']
        let list: number[] = [1, 2, 3]   //非响应式
        let nustr: number = 11    //非响应式 
        let str: string = '11'
        onMounted(() => {
            // gooclis()
        });
        const gooclis = () => {   //定义方法
            cont.value++    //视图改变
            nustr++         //视图不会改变
        }
        const redone = computed(() => {   //计算属性return返回
            return conts.value + 1
        })
        // console.log(nustr);
        return {
            cont,
            conts,
            nustr,
            list,
            gooclis,
            redone
        };
    },

}
</script>

<style></style>
